@include b('cropping') {
    display: flex;
    flex-direction: column;
    gap: getCssVar(spacing, tight);
    width: 100%;
    height: 100%;
    overflow: hidden;
    user-select: none;
    @include e('content') {
      display: flex;
      flex: 1;
      flex-direction: column;
      gap: getCssVar(spacing, tight);
      align-items: center;
      width: 100%;
      height: 100%;
      overflow: hidden;
      @include m('crop') {
        position: relative;
        width: 100%;
        height: 100%;
        overflow: hidden;
      }
      @include m('croparea') {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 10;
        box-sizing: border-box;
        overflow: hidden;
        color: rgb(0 0 0 / 50%);
        cursor: move;
        content: '';
        background: transparent;
        border: 1px solid rgb(255 255 255 / 50%);
        box-shadow: 0 0 0 9999em;
        transform: translate(-50%, -50%);
      }
      @include m('img') {
        position: absolute;
        inset: 0;
        top: 50%;
        left: 50%;
        max-width: 100%;
        max-height: 100%;
        user-select: none;
        transform: translate(-50%, -50%);
      }
    }
    @include e('footer') {
      display: flex;
      flex-shrink: 0;
      gap: getCssVar(spacing, base);
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 50px;
      overflow: hidden;
      border-top: 1px solid getCssVar(color, border);
      @include m('cancel') {
        width: 45%;
        padding: getCssVar(spacing, tight) getCssVar(spacing, base);
        text-align: center;
        cursor: pointer;
        border: 1px solid getCssVar(color, border);
        border-radius: getCssVar(border-radius, small);
       
      }
      @include m('confirm') {
        width: 45%;
        padding: getCssVar(spacing, tight) getCssVar(spacing, base);
        color: getCssVar(color, white);
        text-align: center;
        cursor: pointer;
        background-color: getCssVar(color, primary);
        border: 1px solid getCssVar(color, border);
        border-radius: getCssVar(border-radius, small);
  
      }
    }
  }
  